<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/common/taglibs.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<!-- InstanceBegin template="/Templates/hpp_c1_c2.dwt" codeOutsideHTMLIsLocked="false" -->
<head>
<%@ include file="/common/meta.jsp"%>
<title>VTC - Holistic Programme Planning - HPP</title>
<%@ include file="/common/css_js.jsp"%>

<SCRIPT type="text/javascript">


	$(document).ready(function() {
		validator=$("#projectionTypeForm").validate({
			
			rules:{
				<s:iterator value="results" var="projectionType" status="st">
					"results[${st.index}].selfDefinedProgressionRate":{
						maxlength:5
					},
				</s:iterator>
				"":{
					
				}
					
				
			}
		});
	});
	var iframeResize = function(){
		var targObj = self;
		//1.  取得iframe的对象
		var targWin = targObj.parent.document.getElementById("programmeIframe");
		//2.  取得本页面的显示数据对象
		var projectionTypeTable = document.getElementById("projectionTypeDiv");
		
		if(targWin != null) {
		
			//3, 下面是取数据表格高度,
			// 也可取本htm文档的高度 ： var HeightValue = targObj.document.body.scrollHeight
			var HeightValue = projectionTypeTable.scrollHeight+20;
			targWin.style.height = HeightValue + "px";
		}
		
	}

	$(document).ready(function() {
		setTimeout(function () { iframeResize(); }, 100);
	});
	
	
	function disableOthers(checkType, index){
		switch(checkType){
		case "1":
			$("#"+index+"_selfDefinedProgressionRate").attr("disabled",true);
			break;
		case "2":
			$("#"+index+"_selfDefinedProgressionRate").attr("disabled",false);
			break;
		case "3":
			$("#"+index+"_selfDefinedProgressionRate").attr("disabled",true);
			break;
		}
	}
	
	function displaySubjectGroupTD(){
		$("#subjectGroupTD").show();
	}
	
	function KeyPress(objTR) { 
	    var txtval=objTR.value;  
	    var l=objTR.value.length;
	    var key = event.keyCode;
	    if((key < 48||key > 57)&&key != 46)
	    {  
	        event.keyCode = 0;
	    }    
	    else
	    {
	        if(key == 46)
	        {
	            if(txtval.indexOf(".") != -1||txtval.length == 0)
	            {
	                event.keyCode = 0;
	            }
	        }
	    }
	    if(txtval.indexOf(".") != -1)
	    {
	        var decimalPart=txtval.substring(txtval.indexOf(".")+1,l);  
	        if(decimalPart.length>=2)
	        {  
	            event.keyCode = 0;
	        }
	    }
	}
	/*function checkRate(){
		<s:iterator value="results" var="projectionType" status="st">
		var value = document.getElementById(${st.index}+"_selfDefinedProgressionRate").value;
		 if(value==null || value==""){
			 document.getElementById(${st.index}+"_selfDefinedProgressionRate").value=0.0;
		 }
	</s:iterator>
	$("#projectionTypeForm").submit();
	}*/
</SCRIPT>

</head>
<body style="background-color: transparent;">
	<s:form name="projectionTypeForm" id="projectionTypeForm"
		action="programme-plan-projection-type!save.action?no-decorate"
		method="post">

		<div class="sListBorder" id="projectionTypeDiv">
			<div class="sList">
				<s:hidden name="programmeId"></s:hidden>

				<table id="projectionTypeTable" width="100%" cellspacing="0"
					cellpadding="0" border="0" class="sTable">
					<tbody>
						<tr>
							<td class="sTh">Year</td>
							<td class="sTh">Direct Input</td>
							<td class="sTh">Self-Defined Progression Rate</td>
							<td class="sTh">Past Enrolment</td>
							<td class="sTh" style="display: none;" id="subjectGroupTD">Subject
								Group Programme</td>
						</tr>

						<s:if test="%{results!=null&&results.size()!=0}">
							<s:iterator value="results" var="projectionType" status="st">
								<tr class="sRow2">
									<td class="sCell"><input type="hidden"
										name="results[${st.index}].id"
										value="<s:property value='#projectionType.id'/>" /> <s:property
											value="#projectionType.year" />-<s:property
											value="#projectionType.year+1" />
									</td>

									<td class="sCell rc"><input type="radio" checked="checked"
										name="results[${st.index}].planProjectionType"
										value="DirectInput" class="inputRadio"
										onchange="disableOthers('1', '${st.index}')"
										<s:if test='%{#projectionType.planProjectionType.ordinal()==0}'>checked="checked"</s:if>>
									</td>

									<td class="sCell rc"><input type="radio"
										name="results[${st.index}].planProjectionType"
										value="SelfDefinedProgressionRate" class="inputRadio"
										onchange="disableOthers('2', '${st.index}')"
										<s:if test='%{#projectionType.planProjectionType.ordinal()==1}'>checked="checked"</s:if>>
											<input type="text"
											name="results[${st.index}].selfDefinedProgressionRate"
											id="${st.index}_selfDefinedProgressionRate" class="inputText"
											value="<s:property value='#projectionType.selfDefinedProgressionRate'/>"
											<s:if test='%{#projectionType.planProjectionType.ordinal()!=1}'>disabled="true"</s:if>
											onKeyPress="javascript:KeyPress(this);"> <script>
	              	/*var value = "<s:property value='#projectionType.selfDefinedProgressionRate'/>";
		       		 if(value==0.0){
		       			 document.getElementById(${st.index}+"_selfDefinedProgressionRate").value="";
		       		 }*/
	              	  </script>
									</td>

									<td class="sCell rc"><input type="radio"
										name="results[${st.index}].planProjectionType"
										value="PastEnrolment" class="inputRadio"
										onchange="disableOthers('3', '${st.index}')"
										<s:if test='%{#projectionType.planProjectionType.ordinal()==2}'>checked="checked"</s:if>>
									</td>

									<s:if test="#projectionType.subjectGroupPorgramme!=null">
										<td class="sCell rc"><s:property
												value="#projectionType.subjectGroupPorgramme.titleLong" />
										</td>
										<script type="text/javascript">displaySubjectGroupTD();</script>
									</s:if>
								</tr>
							</s:iterator>

						</s:if>
					</tbody>
				</table>
			</div>

			<s:if test="%{results!=null&&results.size()!=0}">

				<div class="btnSet btnSetTypeA">
					<div class="left">
						<s:if test="canEdit">
							<div class="button">
								<div class="left">
									<div class="right">
										<s:submit cssClass="inputButton"></s:submit>
									</div>
								</div>
							</div>
						</s:if>
					</div>
				</div>
			</s:if>
		</div>



	</s:form>
</body>
</html>
